<template>
	<div class="header">
		<div class="header-left">城市</div>
		<div>
			<van-search
				v-model="value"
				shape="round"
				background="#e3251c"
				placeholder="请输入搜索关键词"
        class="header-input"
			/>
		</div>
		<div class="header-right" @click="goto('/personal')" v-if="isLogin">
			我的
		</div>
		<div class="header-right" @click="goto('/login')" v-else>登录</div>
	</div>
</template>
<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router"
import { Col, Row, Field, CellGroup } from "vant"

import { checkLogin } from "../services/index"

const router = useRouter()

const value = ref('')

const goto = (path) => {
	router.push(path)
}

const isLogin = checkLogin()
</script>
<style scoped>
.header {
	height: 50px;
	display: flex;
	background-color: #e3251c;
	font-size: 15px;
	color: #fff;
	font-weight: 600;
	text-align: center;
	justify-content: space-around;
	align-items: center;
}
.header-input{
  height: 50px;
}
</style>
